<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="include/base.jsp" %>
<!DOCTYPE HTML>
<html lang="zh-CN">
<head>
	<meta charset="UTF-8">
	<title>凯盛项目管理系统</title>
	<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
	<link rel="stylesheet" type="text/css" href="css/style.css">
	<style>
    body{
        width: 960px;
        margin-left: auto;
        margin-right: auto;
    }
  </style>
</head>
<body class="body">
	
	<%@ include file="include/top.jsp" %>
	
	<div class="container">
	  <div class="row">
		<div class="span3">
			<%@ include file="include/left.jsp" %>
		</div>
		
		<div class="span9" style="background-color:#fafafa">
		
			<c:forEach items="${requestScope.goal_list }" var="gl" varStatus="vs">
				<ul class="breadcrumb" style="margin-bottom:0px;border-radius: 3px 3px 0 0">
					<li class="active">
						<a href="task.jspx?id=${gl.id }"><i class="icon-th"></i>${gl.title }</a>
					</li>
					<li style="float:right"><i class="icon-edit"></i><a href="editgoal.jspx?id=${gl.id }" class="link-black">编辑</a></li>
				</ul>
				<div class="wall">
					<p style="margin:10px">&nbsp;&nbsp;&nbsp;&nbsp; ${gl.description }</p>
					<!-- 根据目标的state值来判断进度条的长度和颜色 -->
					<c:if test="${gl.state == 0 }">
						<div class="progress progress-danger">
							  <div class="bar" style="width:100%">还没开始</div>
							</div>
					</c:if>
					<c:if test="${gl.state > 0 && gl.state < 60 }">
						<div class="progress progress-warning progress-striped active">
							  <div class="bar" style="width:${gl.state }%">已完成${gl.state }%</div>
							</div>
					</c:if>
					<c:if test="${gl.state >= 60 && gl.state < 100 }">
						<div class="progress progress-striped active">
							  <div class="bar" style="width:${gl.state }%">已完成${gl.state }%</div>
							</div>
					</c:if>
					<c:if test="${gl.state == 100 }">
						<div class="progress progress-success">
							  <div class="bar" style="width:100%">全部完成</div>
							</div>
					</c:if>
				</div>
			
			</c:forEach>
		</div>
	  </div>
	</div>
  	<%@ include file="include/footer.jsp" %>
	<script type="text/javascript" src="js/jquery.min.js"></script>
	<script type="text/javascript" src="js/bootstrap.min.js"></script>
	<script type="text/javascript">
		$(document).ready(function(){

		});
	</script>

</body>
</html>